import React, { Component } from 'react';
import {
  WeaLocaleProvider, WeaTools, WeaErrorPage, WeaTab,
  WeaFormItem, WeaSearchGroup, WeaTable,
} from 'ecCom';
import { Button } from 'antd';
import * as mobx from 'mobx';
import { WeaSwitch } from 'comsMobx';

const { getLabel } = WeaLocaleProvider;
// const WeaTable = WeaTableNew.WeaTable;

class SignLogTable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      hasLoad: false,
    };
  }

  render() {
    const { odocCompsStore = {}, updateSignLogStore } = this.props;
    let params = {};
    try {
      let { requestParam } = odocCompsStore;
      params = mobx.toJS(requestParam);
    } catch (e) {
      params.requestid = '11259256';// 开发热部署测试
    }

    const { signListStore } = updateSignLogStore;
    const { showSearchAd = false } = this.state;

    let tabparams = {
      searchType: ['advanced'],
      advanceHeight: 200,
      buttonsAd: this.getButtonsAdQuick(),
      showSearchAd,
      setShowSearchAd: bool => this.setState({ showSearchAd: bool }),
      searchsAd: this.getSearchs(),
    };

    return (<div>
      <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@nqavv5`} {...tabparams} />
      <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@sbq0xm`}
        // getColumns={this.getColumnsSignList()}
        // comsWeaTableStore={signListStore}
        dataSource={signListStore.datas}
        columns={this.getColumnsSignList()}
        scroll={{ y: 500 }}
        rowKey={'logid'}
        size={'small'}
        onOperatesClick={this.onOperatesClick}
      />
    </div>);
  }

  getButtonsAdQuick = () => {
    const { updateSignLogStore } = this.props;
    const { form, init } = updateSignLogStore;
    return [
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@lxz4l0@search`}
        type="primary"
        onClick={() => {
          init();
          this.setState({ showSearchAd: false });
        }}
      >
        {getLabel(388113, '搜索')}
      </Button>,
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@w935o1@reset`}
        type="ghost"
        onClick={() => {
          form.resetForm();
        }}
      >
        {getLabel(2022, '重置')}
      </Button>,
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@v0ik4p@cancel`} type="ghost" onClick={() => this.setState({ showSearchAd: false })}>
        {getLabel(201, '取消')}
      </Button>,
    ];
  }

	/**
	 * 高级搜索框信息
	 */
  getSearchs = () => {
    const { updateSignLogStore } = this.props;
    const { conditions = [], form } = updateSignLogStore;
    let groups = [];
    if (form.isFormInit) {
      conditions.length > 0 && conditions.map((group, index) => {
        groups.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@ay7ugj@${index}`}
          needTigger={false}
          showGroup={group.defaultshow}
          items={group.items.map(field => ({
            com: (
              <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@wb9v05@${field.domkey[0]}`}
                label={field.label}
                labelCol={{ span: field.labelcol }}
                wrapperCol={{ span: field.fieldcol }}
              >
                <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@bzawr3@${field.domkey[0]}`} fieldConfig={field} form={form} />
              </WeaFormItem>
            ),
            col: field.conditionType.toUpperCase() == WeaTools.types.CASCADER ? 1 : 2,
          }))}
        />);
      });
    }
    return groups;
  }

  onOperatesClick = (record, cindex, operate) => {
    const { updateSignLogStore } = this.props;
    const { index } = operate;
    const { logid } = record;
    if (index === '0') { // 修改
      const { getSignInput } = updateSignLogStore;
      updateSignLogStore.titleparams = record;
      logid && getSignInput({ logid });
    }
    if (index === '1') { // 删除
     let confmsg = getLabel(520073, '确定要删除${userName}在"${nodeName}"环节的操作意见吗？');
	  const {nodeidspan, nodeid, operatorspan, operator} = record;
	  confmsg = confmsg.replace('\${userName}', ` ${operatorspan || operator} `);
	  confmsg = confmsg.replace('\${nodeName}', nodeidspan || nodeid);
      const { doDeleteSignLogByLogId, showConfirm } = updateSignLogStore;
      confmsg = (<span
        dangerouslySetInnerHTML={{ __html: confmsg }}
      />);
      showConfirm(null, confmsg, () => doDeleteSignLogByLogId({ logid }));
    }
  }

  getColumnsSignList = () => {
    const { updateSignLogStore } = this.props;
    const { signListStore = {} } = updateSignLogStore;
    const { columns: col } = signListStore;
    const _this = this;
    let titles = {};
    col && col.map((item) => {
      if (item && item.title) {
        titles[item.dataIndex] = item.title;
        titles[`${item.dataIndex}_width`] = item.width;
      }
    });
    const columns = [
      {
        title: titles.operator || getLabel(99, '操作者'),
        width: titles.operator_width || '12%',
        dataIndex: 'operator',
        render: (text, record) => <span dangerouslySetInnerHTML={{ __html: record.operatorspan || record.operator }} />,
      },
      {
        title: titles.operatorDept || getLabel(385898, '操作者部门'),
        width: titles.operatorDept_width || '12%',
        dataIndex: 'operatorDept',
        render: (text, record) => <span>{record.operatorDeptspan}</span>,
      },
      {
        width: titles['logtype'+"_width"] ||"9%",
		title: titles['logtype']||getLabel(15503, "操作类型"),
        dataIndex: 'logtype',
        render: (text, record) => <span>{record.logtypespan || record.logtype}</span>,
      },
      {
        title: titles.nodeid || getLabel(519984, '操作环节'),
        width: titles.nodeid_width || '9%',
        dataIndex: 'nodeid',
        render: (text, record) => <span>{record.nodeidspan || record.nodeid}</span>,
      },
      {
        title: titles.remark || getLabel(17614, '签字意见'),
        width: titles.remark_width || '35%',
        dataIndex: 'remarkspan',
        render: (text = '') => {
          text = text.replace('src=', 'rep-src=');// 原src替换掉
          text = text.replace('original-src', 'src');// 处理图片问题
          return <span dangerouslySetInnerHTML={{ __html: text }} />;
        },
      },
      {
        title: titles.operatedate || getLabel(15502, '操作时间'),
        width: titles.operatedate_width || '15%',
        dataIndex: 'operatedate',
        render: (text, record) => <span>{record.operatedatespan || record.operatedate}</span>,
      },
      {
        title: titles.operateMenu || getLabel(104, '操作'),
        width: titles.operateMenu_width || '8%',
        dataIndex: 'operateMenu',
        render: (text, record) => {
          const { operates = [] } = signListStore;

          return (<span className={'operateMenu'}>
            {
              operates && operates.map(item => <span onClick={() => _this.onOperatesClick(record, null, item)}>{item.text}</span>)
            }
          </span>);
        },
      },
    ];
    return columns;
  }
}

export default WeaTools.tryCatch(React,
  props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@hxwep2`} msg={props.error ? props.error : getLabel(385218, '对不起，该页面异常，请联系管理员！')} />,
  { error: '' },
)(SignLogTable);
